HTMLify
style.css
Views: 20 | Author: cody
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | @import url('https://fonts.googleapis.com/css2?family=Mochiy+Pop+One&display=swap'); * { box-sizing: border-box; padding: 0; margin: 0; font-family: 'Mochiy Pop One', sans-serif; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #252839; } ul { position: relative; display: flex; flex-direction: column; gap: 30px; } ul li { position: relative; list-style: none; } ul li a { font-size: 4em; text-decoration: none; letter-spacing: 2px; line-height: 1em; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, 0.5); } ul li a::before { content: attr(data-text); position: absolute; color: var(--clr); width: 0; overflow: hidden; transition: 1s; border-right: 8px solid var(--clr); -webkit-text-stroke: 1px var(--clr); } ul li a:hover::before { width: 100%; filter: drop-shadow(0 0 25px var(--clr)) } |